import Pagination from '../../../SyncComponents/Pagination';

export type IPageComponent = {
  setCurrent?: (page: number) => void;
  setPageSize?: (pageSie: number) => void;
  onChange?: (current: number, pageSize: number) => void;
  customPageSizeArr?: number[];
  total: number;
  pageSize: number;
  current: number;
  className?: string;
  options?: number[];
};

export default function PageComponent(props: IPageComponent) {
  const { setCurrent, setPageSize, onChange, total, pageSize, current } = props;

  const onchange = (option: any) => {
    setCurrent?.(option?.current);
    setPageSize?.(option?.pageSize);
    onChange?.(option?.current, option?.pageSize);
  };

  return (
    <div
      className={`${props.className || ''}`}
      style={{ display: total > 0 ? 'flex' : 'none' }}
    >
      <Pagination
        {...props}
        size='small'
        total={total}
        pageSize={pageSize}
        onChange={onchange}
        current={current}
        options={[10, 20, 30, 50, 100]}
      />
    </div>
  );
}
